Using Morph resources

Use the Morph resource to morph between morph targets through a seamless transition. Kanzi uses shaders to enable morphing. See Shaders.

Before you can morph between meshes in Kanzi you need to create the 3D models in a third-party tool and import them to Kanzi Studio.

When you create in your third-party tool meshes between which you want to morph, first create the base mesh and then from that mesh shape the mesh to which you want to morph. When creating the meshes keep in mind:

Morphing meshes

To morph meshes:

  1. In the Assets click Import Assets and import the 3D model which uses morph mesh with morph targets between which you want to morph.
    After Kanzi Studio imports the 3D model to your project, it adds:For example, import a 3D model which includes a morph called Morph_Warning_Start, and meshes Warning_Start and Warning_Ready.

  2. In the Project > Prefabs copy the Model node which uses the Morph resource and paste it to the node where you want to add the morph.
    For example, in the Project > Prefabs copy the Warning_Start node and paste it to the Scene node.
  3. In the Properties in the Morph Target Weights property adjust the weight for each of the Mesh items in the Morph resource to control the shape of the Morph.
    The higher the value, the closer the Morph takes the shape of that mesh. When you keep the sum of the Morph Target Weights at 1, the scale of the resulting shape stays true to the target shapes.
    For example, to change the shape of a morph, use a keyframe animation. See Animating morphing.

Adding meshes to a Morph

Add meshes to a Morph to add shapes between which you want to morph. For the morphing to work correctly add only meshes that are shaped from the same base mesh and have the same topology and amount of vertices and clusters.

To add meshes to a Morph:

  1. In the Library > Meshes create or select a Morph.
    For example, select Morph_Warning_Start.
  2. In the Properties in the Morph Target Weights property:
    1. Click Add and in the dropdown menu select the mesh you want to add to the Morph.
    2. Adjust the weights of the meshes.
      The higher the value, the closer the Morph takes the shape of that mesh. When you keep the sum of the Morph Target Weights at 1, the scale of the resulting shape stays true to the target shapes.

Animating morphing

Use keyframe animations to change the shape of a morph.

To animate morphing:

  1. In the Library > Animations press Alt and right-click and create an Animation Clip.
    For example, name it Morph Animation Clip.
    You use the Animation Clip to host keyframe animations for the meshes in your morph. Each animation targets a specific mesh in the morph and defines the weight of the mesh at different points in time.
  2. In the Library > Animations select the animation clip you created in the previous step and create a keyframe animation for the first mesh you want to morph.
    For example, name the animation Start Animation and in the Properties set:
  3. Repeat the previous step as many times as there are meshes in the Morph you want to animate, and for each animation in the <MorphWeight>[n] set the n to the mesh in the Morph the weight of which you want change with the animation.
    For example, to animate a morph with three meshes, create two more animations, name them Middle Animation and Ready Animation, and set:You use Middle Animation to set the weight of the second mesh in your morph and Ready Animation to set the weight of the third mesh in your morph at different points in time.
  4. Create keyframes for the animations you created in the previous step. See Creating keyframe animations for target property attributes.
    You use the keyframe values to set the Weight properties of the meshes in the morph at different points in time. The higher the value, the closer the Morph takes the shape of that mesh. When you keep the sum of the Morph Target Weights at 1, the scale of the resulting shape stays true to the target shapes.
    For example, to create a one-second linear animation of a morph with three meshes, use these keyframes:
  5. Animate the morph with the keyframe animations you created:
    1. In the Project select the Model node the Mesh property of which is set to the Morph you want to animate. See Morphing meshes.
    2. In the Node Components > Animation section click + Add Animation and select Animation Player.
    3. In the Node Components in the Animation Player you created set the Target Animation Timeline property to the Animation Clip you created in the first step, and set the animation playback. See Playing keyframe animations.
      For example, set:
      • Autoplay Enabled to enabled
      • Playback Mode to Ping pong
      • Repeat Count Infinite to enabled

Using morphs in the API

To manually create a morph timeline and create a playback for timeline clock:

// Create morph and add meshes (created beforehand) into it.
MorphSharedPtr morph = Morph::create(domain, "testMorph");
morph->add(mesh1, 0.0f);
morph->add(mesh2, 1.0f);

// Add node that will hold the morph, then add it to the scene graph (scene).
Model3DSharedPtr model = Model3D::create(domain, "testSphere");
model->setMesh(morph);
scene->addChild(model);

// Create float animation and add two keyframes.
FloatKeyframeAnimationSharedPtr animation = FloatKeyframeAnimation::create(domain);
animation->addLinearKeyframe(chrono::milliseconds(0), 0.0f);
animation->addLinearKeyframe(chrono::milliseconds(100), 1.0f);

// Create timeline and playback.
MorphWeightTimelineSharedPtr morphTimeline = MorphWeightTimeline::create(domain, "testSphere", 0, animation);
SceneGraphTimelinePlaybackContext context(*scene);
TimelinePlaybackSharedPtr playback = morphTimeline->createPlayback(context);

// Add playback to root clock
domain->getRootTimelineClock()->addTimelinePlayback(playback);

For details, see the Morph class in the API reference.

See also

3D assets

Importing 3D assets

Preparing 3D assets in third-party tools

Using meshes

Meshes best practices

Material types and materials

Using material types

Animations

Creating keyframe animations for target property attributes

Playing keyframe animations

Editing shaders

Property precedence